<template>
  <div class="app-container">
    <my-data-table status="QUIT_JOB" ref="dataTable">
      <el-table-column align="center" label="操作" slot="operator" width="120">
        <template slot-scope="scope">
          <el-button type="text" @click="handleJoin(scope.row.id)">再入职</el-button>

          <el-popconfirm title="确定删除吗？" @confirm="handleClean(scope.row.id)">
            <el-button slot="reference" type="text" style="color: red; margin-left: 8px">删除</el-button>
          </el-popconfirm>
          <!-- <el-button  type="text" @click="handleClean(scope.row.id)">清除</el-button> -->
        </template>
      </el-table-column>
    </my-data-table>
  </div>
</template>

<script>
import { update, remove } from '@common/api/worker';
import MyDataTable from './components/table.vue';

export default {
  components: { MyDataTable },
  data() {
    return {
      list: [],
      listLoading: true,
      limit: 10,
      offset: 0,
      showPager: false,
      currentPage: 1,
      totalCount: 0,
    };
  },
  methods: {
    // //清除
    async handleClean(id) {
      const res = await remove(id);
      if (res.data.Id) {
        this.$message({
          message: '工人删除成功',
          type: 'success',
        });
        this.$refs.dataTable.onReset();
      } else {
        this.$message({
          message: '工人删除失败',
          type: 'warning',
        });
      }
    },
    async handleJoin(id) {
      const res = await update({ id, status: '' });
      if (res?.data?.Id) {
        this.$message({
          message: '工人修改成功',
          type: 'success',
        });
        this.$refs.dataTable.onReset();
      } else {
        this.$message({
          message: '工人修改失败',
          type: 'warning',
        });
      }
    },
  },
};
</script>
<style scoped>
.top-filter {
  margin-bottom: 20px;
}
</style>
